<template>
	<view class="ChangePassword">
		<view class="ChangePasswordBox">
			<view class="FormBox">
				<u-field v-model="mobile" label="手机号"	placeholder="请填写手机号" :clearable="false"></u-field>
				<u-field v-model="NewPassword" label="新密码" placeholder="6位数字" type="number" :clearable="false" maxlength="6" :error-message	="errorStr" @blur="showError">
					<!-- <view slot="right" @click="hideBtn1">
						<u-icon  name="eye-fill" size="40" color="#707070"></u-icon>
					</view> -->
				</u-field>
				<u-field v-model="code"	label="验证码" placeholder="请填写验证码" :clearable="false">
					<u-button size="mini" slot="right" type="success" @click="getCode">{{codeText}}</u-button>
				</u-field>
				<u-verification-code ref="uCode" @change="codeChange"></u-verification-code>
				<view style="line-height: 76upx;margin-top: 60upx;height: 80upx;box-sizing: border-box;border: 2upx solid #c0c4cc;color: #606266;border-radius: 40upx;box-sizing: border-box;text-align: center;" @click="sureUpdPass">
					完成
				</view>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	const app = getApp();
	export default {
		data() {
			return {
				mobile:"",
				NewPassword:"",
				OldPassword:'',
				code:"",
				codeText:'',
				type1:"password",
				type2:"password",
				errorStr:""
			}
		},
    onShow(){
      // #ifdef APP-PLUS
      var args = plus.runtime.arguments;
      if(args){
        app.$vm.setShareDetail(args);
      }
      // #endif
    },
		methods: {
			showError(e){
				if(e.detail.value.length!=6){
					this.errorStr = "支付密码仅支持6位数字";
				}else{
					this.errorStr = "";
				}
			},
			sureUpdPass(){
				let obj = {};
				if(!this.mobile){
					this.$refs.uToast.show({
						title:"请输入手机号",
						type:"error",
						duration:2000
					})
					return false;
				}
				if(!app.$vm.globalData.phoneReg.test(this.mobile)){
					this.$refs.uToast.show({
						type:"error",
						title:"手机号格式错误",
						duration:2000
					})
					return false;
				}
				if(!this.NewPassword){
					this.$refs.uToast.show({
						title:"请输入密码",
						type:"error",
						duration:2000
					})
					return false;
				}
				if(this.NewPassword.length!=6){
					this.$refs.uToast.show({
						title:"密码长度必须为6位",
						type:"error",
						duration:2000
					})
					return false;
				}
				if(!this.code){
					this.$refs.uToast.show({
						title:"请输入验证码",
						type:"error",
						duration:2000
					})
					return false;
				}
				obj.mobile = this.mobile;
				obj.code = this.code;
				obj.pay_password = this.NewPassword;
				this.$u.api.userResetPassword(obj).then(res=>{
					console.log(res)
					this.$refs.uToast.show({
						title:"密码修改成功",
						type:"success",
						duration:2000
					})
					setTimeout(()=>{
						uni.navigateBack({
							delta:1
						})
					},2000)
					
				})
			},
			hideBtn1(){
				if(this.type1=="text"){
					this.type1 = "password"
				}else{
					this.type1 = "text"
				}
			},
			hideBtn2(){
				if(this.type2=="text"){
					this.type2 = "password"
				}else{
					this.type2 = "text"
				}
			},
			codeChange(text) {
				this.codeText = text;
			},
			getCode() {
				if(this.$refs.uCode.canGetCode) {
					// 模拟向后端请求验证码
					uni.showLoading({
						title: '正在获取验证码'
					})
					let obj = {};
					obj.mobile = this.mobile;
					obj.type = 5;
					if(!this.mobile){
						this.$refs.uToast.show({
							type:"error",
							title:"请输入手机号",
							duration:2000
						})
						return false;
					}
					console.log(app.$vm.globalData)
					if(!app.$vm.globalData.phoneReg.test(this.mobile)){
						this.$refs.uToast.show({
							type:"error",
							title:"请输入正确的手机号",
							duration:2000
						})
						return false;
					}
					this.$u.api.sendMessage(obj).then(res=>{
						console.log(res)
						uni.hideLoading();
						this.$refs.uToast.show({
							type:"success",
							title:"发送成功",
							duration:2000
						})
						this.$refs.uCode.start();
					})
				}else {
					this.$u.toast('倒计时结束后再发送');
				}
			}
		}
	}
</script>

<style scoped lang="less">
.status_bar{
	height: var(--status-bar-height);
	width: 100%;
}
.ChangePassword{
	background-color: #F3F3F3;
	min-height: 100vh;
	overflow: auto;
	// padding-top: 100upx;
	.ChangePasswordBox{
		// padding: 16upx 24upx;
		.FormBox{
			// width: 702upx;
			background: #FFFFFF;
			opacity: 1;
			border-radius: 8upx;
			padding: 48upx 32upx;
			.custom-style{
				background-color: #FFAC3F;
				font-size: 24upx;
				font-family: Source Han Sans CN;
				font-weight: 400;
				color: #FFFFFF;
			}
		}
	}
}
</style>
